<template>
  <div :class="$style.root">
    <el-form :inline="true" :model="formQuery" label-position="right">
      <el-row>
        <el-col :span="2">
          <div :class="$style.colDiv">
            <div :class="$style.colDivLabel">今日调价失败</div>
            <div :class="$style.colDivText">{{ dayFailureCount }}</div>
          </div>
        </el-col>

        <el-col :span="2">
          <div :class="$style.colDiv">
            <div :class="$style.colDivLabel">今日调价异常</div>
            <div :class="$style.colDivText">{{ dayExceptionCount }}</div>
          </div>
        </el-col>

        <el-col :span="2">
          <div :class="$style.colDiv">
            <div :class="$style.colDivLabel">调价失败总数</div>
            <div :class="$style.colDivText">{{ failureAllCount }}</div>
          </div>
        </el-col>

        <el-col :span="2">
          <div :class="$style.colDiv">
            <div :class="$style.colDivLabel">调价异常总数</div>
            <div :class="$style.colDivText">{{ exceptionAllCount }}</div>
          </div>
        </el-col>

        <el-col :span="2">
          <div :class="$style.colDiv">
            <div :class="$style.colDivLabel">今日待处理</div>
            <div :class="$style.colDivText">{{ dayInitCount }}</div>
          </div>
        </el-col>

        <el-col :span="2">
          <div :class="$style.colDiv">
            <div :class="$style.colDivLabel">今日全部处理</div>
            <div :class="$style.colDivText">{{ dayAllCount }}</div>
          </div>
        </el-col>

        <el-col :span="2">
          <div :class="$style.colDiv">
            <div :class="$style.colDivLabel">今日部分处理</div>
            <div :class="$style.colDivText">{{ dayPartCount }}</div>
          </div>
        </el-col>

        <el-col :span="2">
          <div :class="$style.colDiv">
            <div :class="$style.colDivLabel">待处理总数</div>
            <div :class="$style.colDivText">{{ initCount }}</div>
          </div>
        </el-col>

        <el-col :span="2">
          <div :class="$style.colDiv">
            <div :class="$style.colDivLabel">全部处理总数</div>
            <div :class="$style.colDivText">{{ allCount }}</div>
          </div>
        </el-col>

        <el-col :span="2">
          <div :class="$style.colDiv">
            <div :class="$style.colDivLabel">部分处理总数</div>
            <div :class="$style.colDivText">{{ partCount }}</div>
          </div>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="4">
          <el-form-item label="顶级渠道" :label-width="labelWidth">
            <el-select clearable v-model="formQuery.topChannelCode" placeholder="请选择" style="width: 90%" filterable>
              <el-option v-for="item in topChannelList" :key="item.id" :label="item.name" :value="item.id" />
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="4">
          <el-form-item label="子渠道" :label-width="labelWidth">
            <channel-tree
              :inputWidth="90"
              :topChannelCode="formQuery.topChannelCode"
              :channels="channels"
              :checkedSize="channels.length"
              @affirm="affirmChannel"
            ></channel-tree>
          </el-form-item>
        </el-col>

        <el-col :span="4">
          <el-form-item label="异常原因" :label-width="labelWidth">
            <el-select clearable v-model="formQuery.reason" placeholder="请选择" style="width: 90%" filterable>
              <el-option v-for="item in exceptionTypes" :key="item.id" :label="item.name" :value="item.id" />
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="调价时间" :label-width="labelWidth">
            <el-date-picker
              v-model="auditTime"
              type="datetimerange"
              range-separator="-"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              style="width: 90%;"
              format="yyyy-MM-dd HH:mm:ss"
              @change="timeChange"
            >
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="4">
          <el-button @click="onQuery" type="primary" :loading="querying">查询</el-button>
          <el-button @click="reset" type="info">重置</el-button>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>

<style lang="scss" module>
@import './index.module.scss';
</style>

<script>
import Index from './index';

export default Index;
</script>
